<template>
  <LayInput
      :prefix-icon="iconPrefix"
      :suffix-icon="iconSuffix"
      class="input"
  >
    <template v-for="name in Object.keys($slots)" :key="name" #[name]="sp">
      <slot :name="name" v-bind="sp"></slot>
    </template>
  </LayInput>
</template>

<script setup lang="ts">
import { LayInput } from '@layui/layui-vue';
import { computed } from 'vue';

const props = defineProps<{
  prefixIcon?: string;
  suffixIcon?: string;
}>();

const iconPrefix = computed(() => props.prefixIcon ? 'layui-icon-' + props.prefixIcon : undefined);
const iconSuffix = computed(() => props.suffixIcon ? 'layui-icon-' + props.suffixIcon : undefined);
</script>

<style scoped>

</style>